<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
    <%@ taglib prefix="jstl" uri="http://java.sun.com/jsp/jstl/core" %>
<%-- <%@ page import="java.sql.*,prescription.mysql_connect" %> --%>
    <!-- add_package.php  添加药品的主页 
	add_package_1.php 对选择的药品进行处理，然后返回选择的药品以及数量的内容给add_package.php
	add_package_2.php 将选择的药品显示出来，后面用于跳转下一页或者数据库存储
-->
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<style type="text/css">

	.package{
		border:2px solid black;
		width:260px;
		padding:20px;
		float：right;
		right:50px;
		margin-top:100px; 
		position:absolute;
	}
	 .package_info{
	 	
				border:4px solid black;
				padding:20px;
				width:280px;
				height:100px;
				margin-top: 10px;
		}
	</style>
	<script  src="include/jquery-2.1.1.min.js">
	</script>
	<script type='text/javascript'>
		$(document).ready(function(){
			
			//药品列表翻页的实现
			$(".medicine_list:gt(0)").hide();
			$(".next").click(function(){
				var index = $(".medicine_list").index($(this).parent());
				index +=1;
				$(".medicine_list").hide();
				$(".medicine_list:eq("+index+")").show();
			});
			$(".pre").click(function(){
				var index = $(".medicine_list").index($(this).parent());
				index -=1;
				$(".medicine_list").hide();
				$(".medicine_list:eq("+index+")").show();
			});

			$('.select_medicine').click(function(){
					alert($(this).prev().val());
				 if(isNaN($(this).prev().val())&&isNaN($(this).prev().prev().prev().prev('input:text').val())){
					alert("请确认输入的正确");
				}else if(!isNaN($(this).prev().val())||!isNaN($(this).prev().prev().prev().prev('input:text').val())){
					jQuery.post('add_package_1.do',{
						medicineId:$(this).prev().val(),
						quantity:$(this).prev().prev().prev().prev('input:text').val(),
						description:$(this).prev().prev('input:hidden').val(),
						name:$(this).prev().prev().prev('input:hidden').val()
					},
					function(data){	
						$('#package').html('您选择的药品是：<br/>'+data);
					})
			} 
			});

			$("#py_search").click(function(){
				
				$.post("include/str2py.php",{
					py:$(this).prev().val()
				},
				function(data){
				
					$(".medicine_list").html(data);
				})
			});
			
			$("#kaifang").click(function(){
				jQuery.post('add_package_2.do',{
					package_name:$("#package_name").val(),
					package_description:$("#package_description").val()
				},
				function(data){	
					alert("开方成功");
					window.location = "main_index.jsp";
				})
			});
		});
	</script>
<title>开药方</title>
</head>
<body>


<jstl:import url="include/header2.html" charEncoding="utf-8"/>	
<div id="as" style="margin-left:50px;height:57px;"></div> 
 <ol class="breadcrumb" style="background-color:white;margin-left:11%;">
    <li ><span class="glyphicon glyphicon-home"></span><a href="#" style="margin-left:7px;">主页</a></li>
    <li ><a href="#">病人选择</a></li>
    <li  style="font-color:black;">处方</li>
</ol>
<br/>

<!-- 通过首字母查询药品 -->
<!-- <fieldset style="width:80%;margin-top:20px">
	<div action="include/str2py.php" style="margin-top:9px">
		<input type="text" name="py"/>
		<input type="button" id="py_search" value="查询"/>
	</div> 
</fieldset> -->
		<div style="width:77%;margin-left:11.7%;padding-top:-250px;margin-top:-30px;background-color:#E0E0E0;overflow:hidden;">
				<table class="table" style="margin-left: 35px;">
				  <caption style="margin-left: -10px;">处方</caption>
				  <thead>
				    <tr>
				      <th>序号</th>
				      <th>药品</th>
				      <th>  剂量（单位）</th>
				      <th>说明</th>
				      <th>操作</th>
				    </tr>
				  </thead>
				  <tbody>
				    <tr>
				      <td>1</td>
				      <td>熟地</td>
				      <td><input type="text" id="name" value=" 12 " style="width: 90px;background-color: #E0E0E0;">g</td>
				      <td></td>
				      <td><a>查看</a>  <a>删除</a></td>
				    </tr>
				    <tr>
				      <td>2</td>
				      <td>杞子</td>
				      <td><input type="text" id="name" value=" 12" style="width: 90px;background-color: #E0E0E0;">g</td>
				      <td></td>
				      <td><a>查看</a>  <a>删除</a></td>
				    </tr>
				    <tr>
				      <td>3</td>
				      <td>当归</td>
				      <td><input type="text" id="name" value=" 12" style="width: 90px;background-color: #E0E0E0;">g</td>
				      <td></td>
				      <td><a>查看</a>  <a>删除</a></td>
				    </tr>
				    <tr>
				      <td>4</td>
				      <td>川芎</td>
				      <td><input type="text" id="name" value=" 12" style="width: 90px;background-color: #E0E0E0;">g</td>
				      <td></td>
				      <td><a>查看</a>  <a>删除</a></td>
				    </tr>
				    <tr>
				      <td>5</td>
				      <td>菟丝子</td>
				      <td><input type="text" id="name" value=" 12" style="width: 90px;background-color: #E0E0E0;">g</td>
				      <td></td>
				      <td><a>查看</a>  <a>删除</a></td>
				    </tr>
				  </tbody>
				</table>
				<button type="button" class="btn btn-success" style="margin-left: 1020px;width: 250px;">+</button>
				<div style="margin: 0.67px;">&nbsp</div>
		</div>
		<div style="width:77%;margin-left:11.7%;padding:15px;padding-top:-250px;margin-top:30px;background-color:#E0E0E0;">
		<span  style="font-color:black;margin: 1px;">医嘱</span>
		<br/>
		
		 <label for="name" style="margin-left: 20px;">用法：</label>
		    <select style="width: 200px;margin-top: 20px;margin-right: 10px;">
		      <option style="width: 100px;">水煎服，每天一次</option>
		      <option>2</option>
		      <option>3</option>
		      <option>4</option>
		      <option>5</option>
		    </select>
		    
		   <label for="name">用量：</label>
		    <select style="width: 200px; margin-right: 10px;">
		      <option style="width: 100px;">一天一剂</option>
		      <option>2</option>
		      <option>3</option>
		      <option>4</option>
		      <option>5</option>
		    </select>
		    
		     <label for="name">帖数：</label>
		    <select style="width: 200px;">
		      <option >一帖</option>
		      <option>2</option>
		      <option>3</option>
		      <option>4</option>
		      <option>5</option>
		    </select>
		    <br/>
		    <button type="button" class="btn btn-success" style="width: 350px;margin:20px;">保存</button>
		     <button type="button" class="btn btn-success" style="width: 350px;margin:20px;">预览</button>
		      <button type="button" class="btn btn-success" style="width: 350px;margin:20px;">重新</button>
		</div>
		<%-- <div class="package">
			<p id="package">您还没有选取药品<br/></p>
			药方名：<input type="text" name="package_name"  id="package_name"/><br/>
			药方描述：<input type="text" name="package_description" id="package_description" />
			<input type="button" name="kaifang" id="kaifang" value="开药方"/>
		</div>	

	
		<jstl:forEach begin="0" end="${medicines.size()/4}" varStatus="status1">
			<div class="medicine_list">
				<jstl:forEach items="${medicines}" var="medicine" varStatus="status" begin="${status1.index*4}" end="${status1.index*4+3}">	
					<table class="package_info">
					        <tr><td><jstl:out value="${status.index}"/></td></tr>
							<tr><td>${medicine['name']}</td></tr>
							<tr><td>药描述：<jstl:out value="${medicine['description']}"/></td></tr>
							<tr><td>数量：<input type='text' name='quantity'/>
							<input type="hidden" value="${medicine['name']}"/>
							<input type="hidden" value="${medicine['description']}"/>
							<input type="hidden" value="${medicine['id']}"/> 
			    			<input type='button' class='select_medicine' value='选择该药品'/></td></tr>      
			    	</table>	
				</jstl:forEach>  
				
				<jstl:choose>
					<jstl:when test="${status1.index==0} "><div class="next">下一页</div></jstl:when>
					<jstl:when test="${status1.index==status1.count} "><div class="pre">上一页</div></jstl:when>
					<jstl:otherwise ><div class="pre">上一页</div><div class="next">下一页</div></jstl:otherwise>
				</jstl:choose>
			</div>
			
		</jstl:forEach> --%>
</body>
</html>